<template>
  <div id="center">
        <div class="center-tou">
            <router-link to="/Login" class="router" v-if="tian">
                <div class="yuan"></div>
            </router-link>
            <div class="yuan" v-if="tiana" style="background:pink;"></div>
            <li class="li1">
                {{ math.name}}<br>
                <span>暂无简介涨粉慢</span>
            </li>
        </div>
        <div class="center">
            <div class="center-guan">
                <div>
                    0 <br>
                    <span>关注</span>
                </div>
                <div>
                    0 <br>
                    <span>粉丝</span>
                </div>
                <div>
                    0 <br>
                    <span>获赞与想看</span>
                </div>
            </div>
            <div class="center-dingv">
                
                <router-link to="/Login" class="router"  v-if="tian" >
                    <div class="dingv-con" >
                        <li>
                            <span>我的订单</span><br>
                            查看全部订单
                        </li>
                        <div></div>
                    </div>
                </router-link>
                <div class="dingv-con"  v-if="tiana" >
                    <router-link to="/WALLET">
                        <li>
                            <span>我的订单</span><br>
                            查看全部订单
                        </li>
                    </router-link>
                    <div></div>
                </div>
                <div class="dingv-con">
                    <li>
                        <span>VIP会员</span><br>
                        含400元演出红包
                    </li>
                    <div></div>
                </div>
            </div>
            <div class="center-fu">
                <h2 class="center-h2">我的服务</h2>
                <div class="center-guan">
                    <div>
                        0 <br>
                        <span>观演人</span>
                    </div>
                    <div>
                        0 <br>
                        <span>收货地址</span>
                    </div>
                    <div>
                        0 <br>
                        <span>评价</span>
                    </div>
                    <div>
                        0 <br>
                        <span>优惠券</span>
                    </div>
                </div>
                <li>展开更多</li>
            </div>
        </div>
        <div class="center-dongtai">
            <li>
                <span>动态</span>想看
            </li>
            <div></div>
        </div>
  </div>
</template>

<script>
// import Footer from '../Footer'
import axios from 'axios'
import Vue from 'vue';
import { Toast } from 'vant';

Vue.use(Toast);

export default {
  name: 'App',
  components:{},
  data(){
      return {
          math:[
                {
                  name:"用户名"
                }
          ],
          tian:"",
          tiana:""
      }
  },
  created(){
    //   console.log("本地存储",localStorage.getItem("name"))
    let local = localStorage.getItem("inpon")
    if(local){
        this.tiana = true;
        this.tian = false;
        axios({
            url:`/my`,
            // method:"post",
            params:{
                num:local
            }
        }).then(res=>{
            // Toast.success('发送成功');
            // console.log("res.data",res.data)
            this.math = res.data
            // console.log("this.math",this.math)
            localStorage.setItem('name',this.math.id)
            console.log(localStorage.getItem("name"))
            // this.$router.go(-2)
        }).catch(res=>{
            if(res){
                Toast.fail('网络连接错误');
            }
        })
    }else{
        this.tiana = false;
        this.tian = true;
    }
  }
}
</script>

<style scoped>
#center{
    flex: 1;
    overflow-y: auto;
    background: url(../../../public/img/cai1.gif);
}
.center-tou{
    height: 0.605rem;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 0.14rem;
}
.yuan{
    height: 0.415rem;width: 0.415rem;
    border-radius: 50%;
    background: rebeccapurple;
    margin-right: 0.07rem;
}
.center-tou li{
    font-size: 0.125rem;
    color: #fff;
}
.center-tou li span{
    font-size: 0.075rem;
}
.center{
    border-radius: 0.075rem 0.075rem 0 0;
    background: #fff;
    box-sizing: border-box;
    padding: 0 0.14rem;
}
.center-guan{
    height: 0.545rem;
    display: flex;
    align-items: center;
    justify-content: space-around;
    box-sizing: border-box;
}
.center-guan div{
    font-size: 0.15rem;
    text-align: center;
}
.center-guan div span{
    font-size: 0.1rem;
}
.center-dingv{
    height: 0.5rem;
    display: flex;
    justify-content: space-between;
}
.dingv-con{
    height: 0.415rem;width: 1.4rem;
    border: 1px solid #f2f2f2;
    border-radius: 0.075rem;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.dingv-con li{    
    font-size: 0.065rem;
    color: #666666;
}
.dingv-con li span{
    font-size: 0.12rem;
    color: #000;
}
.dingv-con div{
    width: 0.2125rem;height: 0.2125rem;
    background: pink;
}
.center-fu{
    height: 1.085rem;
    border: 1px solid #f2f2f2;
    border-radius: 0.075rem;
}
.center-h2{
    height: 0.325rem;
    line-height: 0.325rem;
    text-indent: 0.085rem;
    font-size: 0.1rem;
}
.center-fu li{
    height: 0.215rem;
    line-height: 0.215rem;
    text-align: center;
    font-size: 0.1rem;
    color: #999999;
    background: #fbfbfb;
}
.center-dongtai{
    background: #fff;
    box-sizing: border-box;
    padding: 0 0.14rem;
    overflow-y: auto;
}
.center-dongtai li{
    height: 0.405rem;
    line-height: 0.405rem;
    font-size: 0.1rem;
    color: #999999;
}
.center-dongtai li span{
    font-size: 0.13rem;
    color: #000;
    margin-right: 0.14rem;
    padding-bottom: 0.045rem;
    border-bottom: 0.03rem solid #ff2969;
    font-weight: bold;
}
.center-dongtai div{
    height: 2.525rem;
    background: url(../../../public/img/kong1.gif) no-repeat center;
    background-size: 1.655rem;
}
</style>
